{% extends "base.html" %}
{% block title %}New profile · {{ app_name }}{% endblock %}
{% block body %}
<section class="card auth">
  <h1>🐾 New profile <small class="hint">invite only</small></h1>
  {% if error %}<div class="flash err">{{ error }}</div>{% endif %}
  {% if hosted_notice %}<div class="notice"><strong>From whoever runs this instance:</strong> {{ hosted_notice }}</div>{% endif %}
  <form method="post" action="/register" class="fields">
    <label>invite code <input name="invite" value="{{ form.invite }}" autocapitalize="characters" spellcheck="false" placeholder="XXXX-XXXX-XXXX" required></label>
    <label>handle <small class="hint">3–24 · letters, digits, underscore · how you sign in</small>
      <input name="handle" value="{{ form.handle }}" autocomplete="username" autocapitalize="none" spellcheck="false" pattern="[A-Za-z0-9_]{3,24}" required></label>
    <label>display name <small class="hint">optional · what the Handler calls you</small>
      <input name="display_name" value="{{ form.display_name }}" maxlength="40"></label>
    <label>password <small class="hint">at least 10 characters</small>
      <input name="password" type="password" autocomplete="new-password" minlength="10" required></label>
    <label>password, again <input name="password2" type="password" autocomplete="new-password" minlength="10" required></label>
    <label>timezone <small class="hint">your days, streaks and reflections roll over on this clock</small>
      <input name="tz" id="tz" list="tzlist" value="{{ form.tz }}" required>
      <datalist id="tzlist">
        {% for z in common_tz %}<option value="{{ z }}">{% endfor %}
        {% for z in all_tz %}{% if z not in common_tz %}<option value="{{ z }}">{% endif %}{% endfor %}
      </datalist></label>
    <p class="check"><label class="row"><input type="checkbox" name="adult" value="1" required> I am 18 or over.</label></p>
    <p class="check"><label class="row"><input type="checkbox" name="hosted_ok" value="1" required>
      I understand this instance is run by a person, not a company: my log, reflections and photos live on their machine, they could read them, and this is pre-1.0 software whose data may need a wipe. I can export or delete everything myself from <em>Account</em>.</label></p>
    <p><button type="submit" class="btn primary big">make my profile</button> <a class="btn" href="/login">I have one</a></p>
  </form>
</section>
<script>
// pre-select the browser's zone; a wrong guess is one edit away and nothing depends on this running
try { var z = Intl.DateTimeFormat().resolvedOptions().timeZone; var el = document.getElementById('tz');
      if (z && el && !el.dataset.touched) { el.value = z; } } catch (e) {}
</script>
{% endblock %}